<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head>
	<th:block th:include="include :: easyui-header('字典数据列表')" />
</head>
<body class="white-bg">
	<div class="container-div">
		<div class="row">
			<div class="col-sm-12 search-head">
				<div class="easyui-panel">
					<form id="data-form">
						<div class="select-list">
							<ul>
							    <li>
									<label>字典名称：</label>
									<select id="dictType" class="easyui-combobox" name="dictType">
										<option value=" ">所有</option>
						                <option th:each="dict : ${dictList}" th:text="${dict['dictName']}" th:value="${dict['dictType']}" th:field="*{dict.dictType}"></option>
									</select>
								</li>
								<li>
									<label>字典标签：</label>
									<input type="text" name="dictLabel" class="easyui-textbox" data-options="prompt:'请输入字典标签'"/>
								</li>
								<li>
									<label>数据状态：</label>
									<select name="status" class="easyui-combobox" th:with="type=${@dict.getType('sys_normal_disable')}">
								    	<option value=" ">所有</option>
										<option th:each="dict : ${type}" th:text="${dict.dictLabel}" th:value="${dict.dictValue}"></option>
							    	</select>
								</li>
								<li>
									<a class="easyui-linkbutton" data-options="iconCls:'icon-search'" onclick="$.easyUIDataGrid.search()" >查询</a>
									<a class="easyui-linkbutton" data-options="iconCls:'icon-clear'" onclick="$.easyUIDataGrid.reset()" >重置</a>
								</li>
							</ul>
						</div>
					</form>
				</div>
			</div>
			<div class="col-sm-12 search-body">
			     <div id="toolbar" role="group">
		            <a class="easyui-linkbutton" data-options="iconCls:'icon-add'" onclick="dictTypeAdd()" shiro:hasPermission="system:dict:add">新增</a>
		            <a class="easyui-linkbutton" data-options="iconCls:'icon-edit'" onclick="$.easyUIOperate.edit('850','420')" shiro:hasPermission="system:dict:edit">修改</a>
		            <a class="easyui-linkbutton" data-options="iconCls:'icon-delete'" onclick="$.easyUIOperate.removeAll()" shiro:hasPermission="system:dict:remove">删除</a>
		            <a class="easyui-linkbutton" data-options="iconCls:'icon-export'" onclick="$.easyUIOperate.exportExcel()" shiro:hasPermission="system:dict:export">导出</a>
		            <a class="easyui-linkbutton" data-options="iconCls:'icon-extjs-cancel'" onclick="closeItem()" shiro:hasPermission="system:dict:remove">关闭</a>
		        </div>
			    <table id="dg" class="easyui-datagrid"></table>
			</div>
		</div>
	</div>
	<th:block th:include="include :: easyui-footer" />
 	<script th:inline="javascript">
	 	var editFlag = [[${@permission.hasPermi('system:dict:edit')}]];
		var removeFlag = [[${@permission.hasPermi('system:dict:remove')}]];
		var datas = [[${@dict.getType('sys_normal_disable')}]];
    </script>
	<script th:inline="none">
		var prefix = ctx + "system/dict/data";
		$(function() {
			var options = {
				url: prefix + "/list",
				createUrl: prefix + "/add/{id}",
				updateUrl: prefix + "/edit/{id}",
				removeUrl: prefix + "/remove",
				exportUrl: prefix + "/export",
				queryParams: {
					"dictType" : $("#dictType").combobox("getValue")
				},
				modalName: "数据",
				idField: 'dictCode',
				sortName: "dictCode",
		        sortOrder: "asc",
				columns: [[
	           		{
						field:'ck',
						checkbox:true,
						width:30
					},
					{
						field: 'dictCode',
						title: '字典编码',
		            	align: 'center',
		            	hidden:true,
						width: 20
					},
					{
						field: 'dictLabel',
						title: '字典标签',
			            align: 'center',
		          		width: 100,
						formatter: function(value, row, index) {
							var listClass = $.common.equals("default", row.listClass) || $.common.isEmpty(row.listClass) ? "" : "badge badge-" + row.listClass;
	                    	return $.common.sprintf("<span class='%s'>%s</span>", listClass, value);
						}
					},
					{
						field: 'dictValue',
						title: '字典键值',
			            align: 'center',
		          		width: 80
					},
					{
						field: 'dictSort',
						title: '字典排序',
						sortable: true,
			            align: 'center',
		          		width: 50
					},
					{
						field: 'status',
						title: '状态',
						align: 'center',
						width: 60,
						formatter: function(value, row, index) {
							return $.table.selectDictLabel(datas, value);
						}
					},
					{
						field: 'remark',
						title: '备注',
			            align: 'center',
		          		width: 120
					},
					{
						field: 'createTime',
						title: '创建时间',
						sortable: true,
			            align: 'center',
		          		width: 100
					},
					{
						field:'action',
						title: '操作',
						align: 'center',
						width: 80,
						formatter: function(value, row, index) {
							var actions = [];
							actions.push('<a class="btn btn-success btn-xs ' + editFlag + '" href="javascript:void(0)" onclick="$.easyUIOperate.edit(\'850\',\'420\',\'' + row.dictCode + '\')"><i class="fa fa-edit"></i>编辑</a> ');
							actions.push('<a class="btn btn-danger btn-xs ' + removeFlag + '" href="javascript:void(0)" onclick="$.easyUIOperate.remove(\'' + row.dictCode + '\')"><i class="fa fa-remove"></i>删除</a>');
							return actions.join('');
						}
					}
				]]
		    };
		    $.easyUIDataGrid.init(options);
		});
		
		/*字典数据-新增字典*/
		function dictTypeAdd() {
		    var dictType = $("#dictType").combobox("getValue");
		    if($.common.isEmpty(dictType)){
		    	$.messager.alert("提示", "请先选择要添加的字典名称！", 'warning');
	            return;
		    }
		    $.easyUIOperate.add('850','420', dictType);
		}
	</script>
</body>
</html>